<template>
	<view class="custom-navbar">
		<view class="left" >
			<image class="iconfont icon-xiangzuojiantou " @click="goBack"></image>
		</view>
		<view class="center">{{ title }}</view>
		<view class="right" >
			<image class="iconfont icon-fabu " @click="handlePublish" ></image>
		</view>
	</view>
</template>

<script>
	export default {
		name:"release-header-xhd",
		 props: {
		    title:{
				type:String,
				default:"默认标题",
				require:false
			}
		  },
		data() {
			return {
				
			};
		},methods:{
			goBack() {
				// 触发 goBack 事件，传递给父组件
				this.$emit('go-back');
			},
			handlePublish() {
				// 触发 publish 事件，传递给父组件
				this.$emit('publish', { message: '发布成功' });
			}
		}
	}
</script>

<style lang="scss">
	.custom-navbar{
		.left {
			// background-color: red;
			position: absolute;
			left:  0;
			height:100rpx;
			width: 100rpx;
			display: flex;
			align-items: center;
			justify-content: center;
		  //background-color: red;
		  .iconfont{
		    color: #000;
			font-size: 40rpx;
			width: 50%;
			height: 100rpx;
			text-align: center;
			line-height: 100rpx;
			 // background-color: black;
		  }
		}
		padding-top: var(--status-bar-height);
		z-index: 9999;
		font-size: 1.2rem;
		height: 100rpx;
		width: 100%;
		background-color: #f0f0f0;
		position: sticky;
		top: 0;
		//padding: 10rpx;
		 display: flex;
		  justify-content: center;
		  align-items: center;
		  border-bottom:1rpx solid  #7A7E83;
		  
		  .center{
			  color: #000;
			  font-weight:bold;
			  font-family: "楷体", "SimSun", "宋体", sans-serif;
		  }
		.right {
			position: absolute;
			right: 0;
			height:100rpx;
			width: 100rpx;
			display: flex;
			align-items: center;
			justify-content: center;
		  //background-color: red;
		  .icon-fabu{
		    color: #000;
			font-size: 40rpx;
			width: 50%;
			height: 100rpx;
			text-align: center;
			line-height: 100rpx;
			 // background-color: black;
		  }
		}
	}
</style>